<template>
    <el-dialog
            :close-on-click-modal="false"
            :model-value="api.detailState.visible"
            :title="api.detailState.title"
            destroy-on-close
            width="600"
            @close="api.onCloseDetail()"
    >
        <el-descriptions :column="1">
            <el-descriptions-item label="名称：">{{ api.detailState.form.name }}</el-descriptions-item>
            <el-descriptions-item label="父级：">{{ api.detailState.form.parent ? api.detailState.form.parent.name : "顶级（无父级）" }}</el-descriptions-item>
            <el-descriptions-item label="是否有子级：">{{ api.detailState.form.isLeaf ? "否" : "是" }}</el-descriptions-item>
            <el-descriptions-item label="序号：">{{ api.detailState.form.sort }}</el-descriptions-item>
        </el-descriptions>
    </el-dialog>
</template>

<script lang="ts" setup>
import {OrgApi} from "~/api/system/org/org.api";

interface Props {
    api: OrgApi;
}

const {api} = withDefaults(defineProps<Props>(), {});

</script>

<style lang="less" scoped>

</style>
